<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>jQuery form.js Unit Test</title>

<!-- load latest build of jquery.js -->
<script type="text/javascript" src="../../../jquery/dist/jquery.js"></script>

<!-- load testrunner from jquery project -->
<script type="text/javascript" src="../../../jquery/test/data/testrunner.js"></script>

<!-- load form.js (this is what we're testing! -->
<script type="text/javascript" src="../jquery.form.js"></script>

<link rel="Stylesheet" media="screen" href="../../../jquery/test/data/testsuite.css" />

<script>
_config.asyncTimeout = 5;

// test form with inputs named 'action' and 'method'
test("'action' and 'method' form attributes", function() {
    var f = $("#form1");
    ok( f.attr('action').match('text.php'), "form 'action'");
    ok( f.attr('method').match('get'), "form 'method'");
});

// test serialization to array
test("formToArray: multi-select", function() {
    var a = $("#form1").formToArray();
    ok( a.constructor == Array, "type check");
    ok( a.length == 13, "array length");
    ok( arrayCount(a, 'Multiple') == 3, "multi-select");
});

// test serialization to array
test("formToArray: 'action' and 'method' inputs", function() {
    var a = $("#form1").formToArray();
    ok( a.constructor == Array, "type check");
    ok( arrayValue(a, 'action') == 1, "input name=action");
    ok( arrayValue(a, 'method') == 2, "input name=method");
});

// test formToArray semantic support
test("formToArray: semantic test", function() {
    var formData = $("#form2").formToArray(true);
    var testData = ['a','b','c','d','e','f'];
    for (var i=0; i < 6; i++) {
        ok(formData[i].name == testData[i], "match value at index="+i);
    }
});

test("formToArray: text promotion for missing value attributes", function() {
    var expected = [
        { name: 'A', value: ''},
        { name: 'B', value: 'MISSING_ATTR'},
        { name: 'C', value: ''},
        { name: 'C', value: 'MISSING_ATTR'}
    ];

    var a = $('#form6').formToArray(true);

    // verify all the option values
    for (var i=0; i < a.length; i++) {
        ok( a[i].name  == expected[i].name,  'Name: '  + a[i].name  + ' = ' + expected[i].name);
        ok( a[i].value == expected[i].value, 'Value: ' + a[i].value + ' = ' + expected[i].value);
    }
});

// test string serialization
test("serialize: param count", function() {
    var s = $("#form1").formSerialize();
    ok( s.constructor == String, "type check");
    ok( s.split('&').length == 13, "string array length");
});

// test support for input elements not contained within a form
test("serialize: pseudo form", function() {
    var s = $("#pseudo *").fieldSerialize();
    ok( s.constructor == String, "type check");
    ok( s.split('&').length == 3, "string array length");
});


// test resetForm
test("resetForm (text input)", function() {
    var $el = $('#form1 input[@name=Name]');
    var val = $el.val();
    ok( 'MyName1' == val, 'beforeSubmit: ' + val);
    $el.val("test");
    val = $el.val();
    ok( 'test' == $el.val(), 'update: ' + val);
    $('#form1').resetForm();
    val = $el.val();
    ok( 'MyName1' == val, 'success: ' + val);
});

// test resetForm
test("resetForm (select)", function() {
    var $el = $('#form1 select[@name=Single]');
    var val = $el.val();
    ok( 'one' == val, 'beforeSubmit: ' + val);
    $el.val("two");
    val = $el.val();
    ok( 'two' == $el.val(), 'update: ' + val);
    $('#form1').resetForm();
    val = $el.val();
    ok( 'one' == val, 'success: ' + val);
});

// test resetForm
test("resetForm (textarea)", function() {
    var $el = $('#form1 textarea');
    var val = $el.val();
    ok( 'This is Form1' == val, 'beforeSubmit: ' + val);
    $el.val("test");
    val = $el.val();
    ok( 'test' == val, 'udpate: ' + val);
    $('#form1').resetForm();
    val = $el.val();
    ok( 'This is Form1' == val, 'success: ' + val);
});

// test resetForm
test("resetForm (checkbox)", function() {
    var el = $('#form1 input:checkbox:checked')[0];
    var val = el.value;
    ok( el.checked, 'beforeSubmit: ' + el.checked);
    el.checked = false;
    ok( !el.checked, 'update: ' + el.checked);
    $('#form1').resetForm();
    ok( el.checked, 'success: ' + el.checked);
});

// test resetForm
test("resetForm (radio)", function() {
    var el = $('#form1 input:radio:checked')[0];
    var val = el.value;
    ok( el.checked, 'beforeSubmit: ' + el.checked);
    el.checked = false;
    ok( !el.checked, 'update: ' + el.checked);
    $('#form1').resetForm();
    ok( el.checked, 'success: ' + el.checked);
});


// test clearForm
test("clearForm (text input)", function() {
    var $el = $('#form1 input[@name=Name]');
    var val = $el.val();
    ok( 'MyName1' == val, 'beforeSubmit: ' + val);
    $('#form1').clearForm();
    val = $el.val();
    ok( !val, 'success: ' + val);
});

// test resetForm
test("clearForm (select)", function() {
    var $el = $('#form1 select[@name=Single]');
    var val = $el.val();
    ok( 'one' == val, 'beforeSubmit: ' + val);
    $('#form1').clearForm();
    val = $el.val();
    ok( '' == val, 'success: ' + val);
});

// test clearForm; here we're testing that a hidden field is NOT cleared
test("clearForm: (hidden input)", function() {
    var $el = $('#form1 input:hidden');
    var val = $el.val();
    ok( 'hiddenValue' == val, 'beforeSubmit: ' + val);
    $('#form1').clearForm();
    val = $el.val();
    ok( 'hiddenValue' == val, 'success: ' + val);
});


// test clearForm; here we're testing that a submit element is NOT cleared
test("clearForm: (submit input)", function() {
    var $el = $('#form1 input:submit');
    var val = $el.val();
    ok( 'Submit1' == val, 'beforeSubmit: ' + val);
    $('#form1').clearForm();
    val = $el.val();
    ok( 'Submit1' == val, 'success: ' + val);
});

// test clearForm
test("clearForm (checkbox)", function() {
    var el = $('#form1 input:checkbox:checked')[0];
    ok( el.checked, 'beforeSubmit: ' + el.checked);
    $('#form1').clearForm();
    ok( !el.checked, 'success: ' + el.checked);
});


// test clearForm
test("clearForm (radio)", function() {
    var el = $('#form1 input:radio:checked')[0];
    ok( el.checked, 'beforeSubmit: ' + el.checked);
    $('#form1').clearForm();
    ok( !el.checked, 'success: ' + el.checked);
});

// test ajaxSubmit target update
test("ajaxSubmit: target == String", function() {
    $('#targetDiv').empty();
    stop();
    var opts = {
        target: '#targetDiv',
        success: function() { // post-callback
            ok( true, 'post-callback');
            ok( $('#targetDiv').text().match("Lorem ipsum"), "targetDiv updated");
            start();
        }
    };

    expect(2);
    $('#form3').ajaxSubmit(opts);
});

// test passing jQuery object as the target
test("ajaxSubmit: target == jQuery object", function() {
    stop();
    var target = $('#targetDiv');
    target.empty();

    var opts = {
        target: target,
        success: function(responseText) { // post-callback
            ok( true, 'post-callback');
            ok( $('#targetDiv').text().match("Lorem ipsum"), "targetDiv updated");
            start();
        }
    };

    expect(2);
    $("#form2").ajaxSubmit(opts);
});

// test passing DOM element as the target
test("ajaxSubmit: target == DOM element", function() {
    stop();
    $('#targetDiv').empty();
    var target = $('#targetDiv')[0];

    var opts = {
        target: target,
        success: function(responseText) { // post-callback
            ok( true, 'post-callback');
            ok( $('#targetDiv').text().match("Lorem ipsum"), "targetDiv updated");
            start();
        }
    };

    expect(2);
    $("#form2").ajaxSubmit(opts);
});

// test simulated $.load behavior
test("ajaxSubmit: load target with scripts", function() {
    stop();
    $('#targetDiv').empty();

    var opts = {
        target: '#targetDiv',
        url:    'doc-with-scripts.html?' + new Date().getTime(),
        success: function(responseText) { // post-callback
            ok( true, 'success-callback');
            ok( $('#targetDiv').text().match("Lorem ipsum"), "targetDiv updated");
            ok( typeof unitTestVariable1 != 'undefined', 'first script block executed');
            ok( typeof unitTestVariable2 != 'undefined', 'second script block executed');
            ok( typeof scriptCount != 'undefined', 'third script block executed');
            ok( scriptCount == 1, 'scripts executed once: ' + scriptCount);
            start();
        }
    };

    expect(6);
    $("#form2").ajaxSubmit(opts);
});

// test ajaxSubmit pre-submit callback
test("ajaxSubmit: pre-submit callback", function() {
    var opts = {
        beforeSubmit: function(a, jq) { // pre-submit callback
            ok( true, 'pre-submit callback');
            ok( a.constructor == Array, "type check array");
            ok( jq.jquery, "type check jQuery");
            ok( jq[0].tagName.toLowerCase() == 'form', "jQuery arg == 'form': " + jq[0].tagName.toLowerCase());
        }
    };

    expect(4);
    $('#form3').ajaxSubmit(opts);
});

// test ajaxSubmit post-submit callback for response and status text
test("ajaxSubmit: post-submit callback", function() {
    stop();

    var opts = {
        success: function(responseText, statusText) { // post-submit callback
            ok( true, 'post-submit callback');
            ok( responseText.match("Lorem ipsum"), "responseText");
            ok( statusText == "success", "statusText");
            start();
        }
    };

    expect(3);
    $('#form3').ajaxSubmit(opts);
});

// test ajaxSubmit with function argument
test("ajaxSubmit: function arg", function() {
    stop();

    expect(1);
    $('#form3').ajaxSubmit(function() {
        ok( true, 'callback hit');
        start();
    });
});

// test semantic support via ajaxSubmit's pre-submit callback
test("ajaxSubmit: semantic test", function() {
    var testData = ['a','b','c','d','e','f'];

    var opts = {
        semantic: true,
        beforeSubmit: function(a, jq) { // pre-submit callback
            ok( true, 'pre-submit callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            for (var i=0; i < a.length; i++) {
                ok(a[i].name == testData[i], "match value at index="+i);
            }
        }
    };

    expect(9);
    $('#form2').ajaxSubmit(opts);
});

// test json datatype
test("ajaxSubmit: dataType == json", function() {
    stop();

    var opts = {
        url: 'json.txt',
        dataType: 'json',
        success: function(data, statusText) { // post-submit callback
            // assert that the json data was evaluated
            ok( typeof data == 'object', 'json data type');
            ok( data.name == 'jquery-test', 'json data contents');
            start();
        }
    };

    expect(2);
    $('#form2').ajaxSubmit(opts);
});

// test script datatype
test("ajaxSubmit: dataType == script", function() {
    stop();

    var opts = {
        url: 'script.txt?' + new Date().getTime(), // don't let ie cache it
        dataType: 'script',
        success: function(responseText, statusText) { // post-submit callback
            ok( typeof formScriptTest == 'function', 'script evaluated');
            ok( responseText.match('formScriptTest'), 'script returned');
            start();
        }
    };

    expect(2);
    $('#form2').ajaxSubmit(opts);
});

// test xml datatype
test("ajaxSubmit: dataType == xml", function() {
    stop();

    var opts = {
        url: 'test.xml',
        dataType: 'xml',
        success: function(responseXML, statusText) { // post-submit callback
            ok( typeof responseXML == 'object', 'data type xml');
            ok( $('test', responseXML).size() == 3, 'xml data query');
            start();
        }
    };

    expect(2);
    $('#form2').ajaxSubmit(opts);
});


// test that args embedded in the action are honored; no real way
// to assert this so successful callback is used to signal success
test("ajaxSubmit: existing args in action attr", function() {
    stop();

    var opts = {
        success: function() { // post-submit callback
            ok( true, 'post callback');
            start();
        }
    };

    expect(1);
    $('#form5').ajaxSubmit(opts);
});

// test ajaxSubmit using pre-submit callback to cancel submit
test("ajaxSubmit: cancel submit", function() {

    var opts = {
        beforeSubmit: function(a, jq) { // pre-submit callback
            ok( true, 'pre-submit callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            return false;  // return false to abort submit
        },
        success: function() { // post-submit callback
            ok( false, "should not hit this post-submit callback");
        }
    };

    expect(3);
    $('#form3').ajaxSubmit(opts);
});

// test submitting a pseudo-form
test("ajaxSubmit: pseudo-form", function() {
    stop();

    var opts = {
        beforeSubmit: function(a, jq) { // pre-submit callback
            ok( true, 'pre-submit callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            ok( jq[0].tagName.toLowerCase() == 'div', "jQuery arg == 'div'");
        },
        success: function() { // post-submit callback
            ok( true, 'post-submit callback');
            start();
        },
        // url and method must be provided for a pseudo form since they can
        // not be extracted from the markup
        url:  'text.php',
        type: 'post'
    };

    expect(5);
    $("#pseudo").ajaxSubmit(opts);
});

// test eval of json response
test("ajaxSubmit: evaluate response", function() {
    stop();

    var opts = {
        success: function(responseText) { // post-callback
            ok( true, 'post-callback');
            var data = eval.call(window, '('+responseText+')');
            ok( data.name == 'jquery-test', 'evaled response');
            start();
        },
        url: 'json.txt'
    };

    expect(2);
    $("#form2").ajaxSubmit(opts);
});


// test pre and post callbacks for ajaxForm
test("ajaxForm: pre and post callbacks", function() {
    stop();

    var opts = {
        beforeSubmit: function(a, jq) { // pre-submit callback
            ok( true, 'pre-submit callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
        },
        success: function() { // post-submit callback
            ok( true, 'post-submit callback');
            start();
        }
    };

    expect(4);
    $("#form4").ajaxForm(opts);
    $('#submitForm4')[0].click();  // trigger the submit button
});

// test that the value of the submit button is captured
test("ajaxForm: capture submit element", function() {

    var opts = {
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            ok( arrayValue(a, 'form4inputName') != null, "submit button");
        }
    };

    expect(4);
    $("#form4").ajaxForm(opts);
    $('#submitForm4withName')[0].click();
});

// test image submit support
test("ajaxForm: capture submit image coordinates", function() {

    var opts = {
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            ok( arrayValue(a, 'myImage.x') != null, "x coord");
            ok( arrayValue(a, 'myImage.y') != null, "y coord");
        }
    };

    expect(5);
    $("#form4").ajaxForm(opts);
    $('#form4imageSubmit')[0].click();
});

// test image submit support
test("ajaxForm: capture submit image coordinates (semantic=true)", function() {

    var opts = {
        semantic: true,
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
            ok( arrayValue(a, 'myImage.x') != null, "x coord");
            ok( arrayValue(a, 'myImage.y') != null, "y coord");
        }
    };

    expect(5);
    $("#form4").ajaxForm(opts);
    $('#form4imageSubmit')[0].click();
});

// test that the targetDiv gets updated
test("ajaxForm: update target div", function() {
    $('#targetDiv').empty();
    stop();

    var opts = {
        target: '#targetDiv',
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
            ok( a.constructor == Array, "type check");
            ok( jq.jquery, "type check jQuery");
        },
        success: function() {
            ok( true, 'post-callback');
            ok( $('#targetDiv').text().match("Lorem ipsum"), "targetDiv updated");
            start();
        }
    };

    expect(5);
    $("#form4").ajaxForm(opts);
    $('#submitForm4')[0].click();
});

test("'success' callback", function() {
    $('#targetDiv').empty();
    stop();

    var opts = {
        success: function() {
            ok( true, 'post-callback');
            start();
        }
    };

    expect(1);
    $('#form3').ajaxSubmit(opts);
});

test("'error' callback", function() {
    $('#targetDiv').empty();
    stop();

    var opts = {
        url: 'bogus.php',
        error: function() {
            ok( true, 'error-callback');
            start();
        },
        success: function() { // post-submit callback
            ok( false, "should not hit post-submit callback");
        }
    };

    expect(1);
    $('#form3').ajaxSubmit(opts);
});


test("fieldValue(true)", function() {
    ok ('5'  == $('#fieldTest input').fieldValue(true)[0], 'input');
    ok ('1'  == $('#fieldTest :input').fieldValue(true)[0], ':input');
    ok ('5'  == $('#fieldTest :hidden').fieldValue(true)[0], ':hidden');
    ok ('14' == $('#fieldTest :password').fieldValue(true)[0], ':password');
    ok ('12' == $('#fieldTest :radio').fieldValue(true)[0], ':radio');
    ok ('1'  == $('#fieldTest select').fieldValue(true)[0], 'select');

    var expected = ['8','10'];
    var result = $('#fieldTest :checkbox').fieldValue(true);
    ok (result.length == expected.length, 'result size check (checkbox): ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok ( result[i] == expected[i], expected[i] );

    expected = ['3','4'];
    result = $('#fieldTest [@name=B]').fieldValue(true);
    ok (result.length == expected.length, 'result size check (select-multiple): ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok ( result[i] == expected[i], expected[i] );
});

test("fieldValue(false)", function() {
    ok ('5'  == $('#fieldTest input').fieldValue(false)[0], 'input');
    ok ('1'  == $('#fieldTest :input').fieldValue(false)[0], ':input');
    ok ('5'  == $('#fieldTest :hidden').fieldValue(false)[0], ':hidden');
    ok ('14' == $('#fieldTest :password').fieldValue(false)[0], ':password');
    ok ('1'  == $('#fieldTest select').fieldValue(false)[0], 'select');

    var expected = ['8','9','10'];
    var result = $('#fieldTest :checkbox').fieldValue(false);
    ok (result.length == expected.length, 'result size check (checkbox): ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok ( result[i] == expected[i], expected[i] );

    expected = ['11','12','13'];
    result = $('#fieldTest :radio').fieldValue(false);
    ok (result.length == expected.length, 'result size check (radio): ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok ( result[i] == expected[i], expected[i] );

    expected = ['3','4'];
    result = $('#fieldTest [@name=B]').fieldValue(false);
    ok (result.length == expected.length, 'result size check (select-multiple): ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok ( result[i] == expected[i], expected[i] );
});

test("fieldSerialize(true) input", function() {
    var expected = ['C=5', 'D=6', 'F=8', 'F=10', 'G=12', 'H=14'];

    var result = $('#fieldTest input').fieldSerialize(true);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(true) :input", function() {
    var expected = ['A=1','B=3','B=4','C=5','D=6','E=7','F=8','F=10','G=12','H=14'];

    var result = $('#fieldTest :input').fieldSerialize(true);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(false) :input", function() {
    var expected = ['A=1','B=3','B=4','C=5','D=6','E=7','F=8','F=9','F=10','G=11','G=12','G=13','H=14','I=15','J=16'];

    var result = $('#fieldTest :input').fieldSerialize(false);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(true) select-mulitple", function() {
    var expected = ['B=3','B=4'];

    var result = $('#fieldTest [@name=B]').fieldSerialize(true);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(true) :checkbox", function() {
    var expected = ['F=8','F=10'];

    var result = $('#fieldTest :checkbox').fieldSerialize(true);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(false) :checkbox", function() {
    var expected = ['F=8','F=9','F=10'];

    var result = $('#fieldTest :checkbox').fieldSerialize(false);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(true) :radio", function() {
    var expected = ['G=12'];

    var result = $('#fieldTest :radio').fieldSerialize(true);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});

test("fieldSerialize(false) :radio", function() {
    var expected = ['G=11','G=12','G=13'];

    var result = $('#fieldTest :radio').fieldSerialize(false);
    result = result.split('&');

    ok (result.length == expected.length, 'result size check: ' + result.length + '=' + expected.length);
    for (var i=0; i < result.length; i++)
        ok( result[i] == expected[i], expected[i] + ' = ' + result[i]);
});


test("ajaxForm - auto unbind", function() {
    $('#targetDiv').empty();
    stop();

    var opts = {
        target: '#targetDiv',
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
        },
        success: function() {
            ok( true, 'post-callback');
            start();
        }
    };

    expect(2);
    // multiple binds
    $("#form8").ajaxForm(opts).ajaxForm(opts).ajaxForm(opts);
    $('#submitForm8')[0].click();
});

test("ajaxFormUnbind", function() {
    $('#targetDiv').empty();
    stop();

    var opts = {
        target: '#targetDiv',
        beforeSubmit: function(a, jq) { // pre-callback
            ok( true, 'pre-callback');
        },
        success: function() {
            ok( true, 'post-callback');
            start();
        }
    };

    expect(0);
    // multiple binds
    $("#form9").ajaxForm(opts).submit(function(){return false;});
    $("#form9").ajaxFormUnbind(opts);
    $('#submitForm9')[0].click();
    
    setTimeout(start, 500);
});

// helper method
function arrayCount(arr, key) {
    var count=0;
    for (var i=0; i < arr.length; i++) {
        if (arr[i].name == key)
            count++;
    }
    return count;
}

// helper method
function arrayValue(arr, key) {
    for (var i=0; i < arr.length; i++) {
        if (arr[i].name == key)
            return arr[i].value;
    }
}
</script>
</head>
<body id="body">
	<h1 id="banner">jQuery form.js - Test Suite</h1>
	<h2 id="userAgent"></h2>

	<!-- Test HTML -->
	<div id="main" style="display: none;">

        <!-- form1 -->
        <form id="form1" action="text.php" method="get"><div>
                <input type="hidden" name="Hidden" value="hiddenValue" />
                <input name="Name" type="text" value="MyName1" />
                <input name="Password" type="password" />
                <select name="Multiple" multiple="multiple">
                    <optgroup label="block 1">
                        <option value="one" selected="selected">One</option>
                        <option value="two">Two</option>
                        <option value="three">Three</option>
                    </optgroup>
                    <optgroup label="block 2">
                        <option value="four" selected="selected">Four</option>
                        <option value="five">Five</option>
                        <option value="six" selected="selected">Six</option>
                    </optgroup>
                </select>
                <select name="Single">
                    <option value="one" selected="selected">One</option>
                    <option value="two">Two</option>
                    <option value="three">Three</option>
                </select>
                <select name="Single2">
                    <optgroup label="block 3">
                        <option value="A" selected="selected">A</option>
                        <option value="B">B</option>
                        <option value="C">C</option>
                    </optgroup>
                    <optgroup label="block 3">
                        <option value="D">D</option>
                        <option value="E">E</option>
                        <option value="F">F</option>
                    </optgroup>
                </select>
                <input type="checkbox" name="Check" value="1" />
                <input type="checkbox" name="Check" value="2" checked="checked" />
                <input type="checkbox" name="Check" value="3" />
                <input type="radio" name="Radio" value="1" />
                <input type="radio" name="Radio" value="2" checked="checked" />
                <input type="radio" name="Radio" value="3" />
                <input type="text" name="action" value="1" />
                <input type="text" name="method" value="2" />
                <textarea name="Text" rows="2" cols="20">This is Form1</textarea>
                <input type="submit"  name="submitButton" value="Submit1" />
                <input type="submit"  name="submitButton" value="Submit2" />
                <input type="submit"  name="submitButton" value="Submit3" />
                <input type="image"   name="submitButton" value="Submit4" src="submit.gif" />
                <input type="reset"   name="resetButton " value="Reset" />
        </div></form>

        <!-- form2 -->
        <form id="form2" action="text.php" method="get"><div>
            <input    name="a" type="text" />
            <textarea name="b" rows="1" cols="1"></textarea>
            <input    name="c" type="text" />
            <select   name="d"><option value="x">x</option></select>
            <textarea name="e" rows="1" cols="1"></textarea>
            <input    name="f" type="text" />
            <input type="reset"   name="resetButton " value="Reset" />
        </div></form>

        <!-- form3 -->
        <form id="form3" action="text.php" method="post"><div>
            <input name="a" type="text" />
        </div></form>

        <!-- form4 -->
        <form id="form4" action="text.php" method="get"><div>
            <input name="a" type="text" />
            <input type="submit" id="submitForm4" />
            <input type="submit" id="submitForm4withName" name="form4inputName" />
            <input type="image"  id="form4imageSubmit" name="myImage" src="submit.gif" />
        </div></form>

        <!-- form5 -->
        <form id="form5" action="text.php?test=form" method="get"><div>
            <input name="a" type="text" />
            <input type="submit" />
            <input type="submit" name="form5inputName" />
            <input type="image"  id="form5imageSubmit" name="myImage" src="submit.gif" />
        </div></form>

        <!-- form6, 'option' testing -->
        <form id="form6" action="text.php" method="get"><div>
            <select name="A">
                <option value="" selected="selected">EMPTY_STRING</option>    <!-- TEST A: value === empty string -->
            </select>
            <select name="B">
                <option selected="selected">MISSING_ATTR</option>             <!-- TEST B: no value attr -->
            </select>
            <select name="C" multiple="multiple">
                <option value="" selected="selected">EMPTY_STRING</option>
                <option selected="selected">MISSING_ATTR</option>
            </select>
        </div></form>

        <!-- form7, 'enctype' testing -->
        <form id="form7" action="text.php" method="post" enctype="text/css"><div>
            <textarea name="doc">body { padding: 0}</textarea>
        </div></form>

        <form id="form8" action="text.php" method="post"><div>
            <textarea name="ta">blah</textarea>
            <input type="submit" id="submitForm8" />
        </div></form>

        <form id="form9" action="text.php" method="post"><div>
            <textarea name="ta">blah</textarea>
            <input type="submit" id="submitForm9" />
        </div></form>

        <!-- pseudo-form -->
        <div id="pseudo">
            <input name="a" type="text" />
            <input type="checkbox" name="Check" value="1" />
            <input type="checkbox" name="Check" value="2" checked="checked" />
            <select name="Select">
                <option value="opt1" />
                <option value="opt2" selected="selected" />
            </select>
            <input type="submit" value="button" />
        </div>

        <div id="targetDiv"></div>
	</div>

    <!--
    ********************************************************************************
    NOTE: The "fieldTest" form is intentionally placed outside of the "main" div
          because reseting the test fixture causes the default value of the password
          input to be lost in IE (which causes many test failures in the fieldValue
          and fieldSerialize tests)
    ********************************************************************************
    -->

    <form style="display:none" id="fieldTest" action="text.php" method="post"><div>
        <select name="A">
            <option value="1" selected="selected">ONE</option>
            <option value="2">TWO</option>
        </select>
        <select name="B" multiple="multiple">
            <option value="3" selected="selected">ONE</option>
            <option value="4" selected="selected">TWO</option>
            <option value="4b">THREE</option>
        </select>
        <input name="C" type="hidden" value="5" />
        <input name="D" type="text" value="6" />
        <textarea name="E">7</textarea>
        <input name="F" type="checkbox" value="8" checked="checked" />
        <input name="F" type="checkbox" value="9" />
        <input name="F" type="checkbox" value="10" checked="checked" />
        <input name="G" type="radio" value="11" />
        <input name="G" type="radio" value="12" checked="checked" />
        <input name="G" type="radio" value="13" />
        <input name="H" type="password" value="14" />
        <input name="I" type="submit" value="15" />
        <input name="J" type="reset" value="16" />
    </div></form>


	<ol id="tests"></ol>
</body>
</html>
